<template>
	<div>
		<div style="background-color:#fff;border:1px solid #ddd; padding: 20px; margin-bottom: 20px;">
			<el-page-header @back="goBack" content="页面修改"></el-page-header>
		</div>

		<div style="background-color:#fff; padding: 30px; width: 1000px;">
			<el-form ref="form" :model="infor.topic" label-width="120px">
				<el-form-item label="题干"><el-input type="textarea" :rows="3" v-model="infor.topic.question"></el-input></el-form-item>
				<el-form-item label="选项A"><el-input v-model="infor.topic.optionA"></el-input></el-form-item>
				<el-form-item label="选项B"><el-input v-model="infor.topic.optionB"></el-input></el-form-item>
				<el-form-item label="选项C"><el-input v-model="infor.topic.optionC"></el-input></el-form-item>
				<el-form-item label="选项D"><el-input v-model="infor.topic.optionD"></el-input></el-form-item>
				<el-form-item label="选项E"><el-input v-model="infor.topic.optionE"></el-input></el-form-item>
				<el-form-item label="选项F"><el-input v-model="infor.topic.optionF"></el-input></el-form-item>
				<el-form-item label="选项G"><el-input v-model="infor.topic.optionG"></el-input></el-form-item>
				<el-form-item label="选项H"><el-input v-model="infor.topic.optionH"></el-input></el-form-item>
				<el-form-item label="正确答案"><el-input v-model="infor.topic.answerStr"></el-input></el-form-item>
				<el-form-item label="关键字"><el-input type="textarea" :rows="4" v-model="infor.topic.keywords"></el-input></el-form-item>
				<el-form-item label="确定关键字"><el-input type="textarea" :rows="4" v-model="infor.topic.assuredKeywords"></el-input></el-form-item>
				<el-form-item label="技巧细节"><el-input type="textarea" :rows="4" v-model="infor.topic.knackDetail"></el-input></el-form-item>
				<el-form-item label="技巧关键字"><el-input type="textarea" :rows="4" v-model="infor.topic.knackKeyword"></el-input></el-form-item>
				<el-form-item label="技巧"><el-input type="textarea" :rows="4" v-model="infor.topic.knackVoiceTxt"></el-input></el-form-item>
				<el-form-item label="浅解析"><el-input type="textarea" :rows="4" v-model="infor.topic.conciseExplain"></el-input></el-form-item>
				<el-form-item label="深解析"><el-input type="textarea" :rows="8" v-model="infor.topic.explain"></el-input></el-form-item>
				<el-form-item label="文盲解析"><el-input type="textarea" :rows="8" v-model="infor.topic.illiteracyExplain"></el-input></el-form-item>
				<el-form-item>
					<el-button type="primary" @click="clickModify">点击修改</el-button>
				</el-form-item>
			</el-form>
		</div>
	</div>
</template>

<script>
import { defineComponent, onMounted, reactive, inject } from 'vue'
import { useRouter } from 'vue-router'
import { ElMessage } from 'element-plus'
export default defineComponent({
	name: 'laModify',

	setup () {
		const router = useRouter()
		const http = inject('http')
		const infor = reactive({
			show: true,
			topic: {}
		})
		const goBack = () => {
			router.back()
		}
		const clickModify = () => {
			const id = window.sessionStorage.getItem('curItemId')
			http.post(`/api/uni/update?pid=${id}`, infor.topic).then(res => {
				if (res.status === 'ok') {
					ElMessage.success({
						message: '恭喜你，修改成功',
						type: 'success'
					})
					router.back()
				}
			})
		}

		onMounted(() => {
			const topic = window.sessionStorage.getItem('modify_topic')
			infor.topic = JSON.parse(topic)
		})

		return {
			infor,
			goBack,
			clickModify
		}
	}
})
</script>

<style scoped>

</style>
